<template>
  <div>
    <el-form ref="addForm" :model="addNew" :rules="rules" label-width="150px"
             style="width: 1000px;position:relative;overflow: hidden;height: 300px">
      <el-form-item label="权限名" prop="name">
        <el-input v-model="addNew.name"></el-input>
      </el-form-item>
      <el-form-item label="权限值" prop="value">
        <el-input v-model="addNew.value"></el-input>
      </el-form-item>
      <el-form-item label="权限描述" prop="description">
        <el-input v-model="addNew.description"></el-input>
      </el-form-item>
      <el-form-item label="权限序号" prop="sort">
        <el-input v-model="addNew.sort"></el-input>
      </el-form-item>
      <el-form-item style="position: absolute;left: 50%;bottom: 0;transform: translateX(-71%)">
        <el-button type="primary" @click="submitForm('addForm')">添加</el-button>
        <el-button type="danger" @click="resetForm('addForm')">重置</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  name: "jurisdictionAddNew",
  data() {
    return {
      addNew: {
        name: "",
        value: "",
        description: "",
        soft: ""
      },
      rules: {
        name: [],
        value: [],
        description: [],
        sort: []
      }
    }
  },
  methods: {
    submitForm() {
      this.$refs.addForm.validate((valid) => {
        if (valid) {
          this.axios.create(
              {'headers': {'Authorization': localStorage.getItem('adminJwt')}}
          ).post("http://localhost:9999/zx-ams/permission/addNew", this.qs.stringify(this.addNew)).then((response) => {
            if (response.data.state === 200) {
              this.$message({message: "添加完毕，返回并刷新权限数据列表", type: "success"});
              this.$refs.addForm.resetFields();
              this.$emit("changeTab", "list");
            } else {
              this.$message({message: response.data.message, type: "error"});
            }
          })
        } else {
          this.$message({message: "存在不规范的数据", type: "error"})
        }
      });
    },
    resetForm() {
      this.$refs.addForm.resetFields();
    },//用于清除el-form内所有内容
  }
}
</script>

<style scoped>

</style>